<script type="text/javascript">
var __widgets = {$widgets};
$(function(){
    for (k in __widgets)
    {
        //<div class="add_widget_note">{$lang.click_to_add}</div>
        var _widget = $('<li widget_name="'+__widgets[k]['name']+'" data-position="'+__widgets[k]['position']+'" title="{$lang.click_to_add}"><div>' + __widgets[k]['display_name'] + '</div></li>').css('cursor', 'pointer').click(add_widget);
        $('#widget_list_ul').append(_widget);
    }
    $('#widget_save_button').click(save_page);
    $('#handle_hide').click(toggle_panel);
if($("*[widget_type=area].green").length==0){
    $("*[widget_type=area]:first").click();
}else{

    $("#widget_list_ul li").hide();
    $("#widget_list_ul li[data-position='']").show();
    var position=$("*[widget_type=area].green").attr('data-position');
    if(typeof(position)!='undefined'){
        $("#widget_list_ul li[data-position='"+position+"']").show();
    }
}
});
</script>
<div class="handle" id="template_panel">
    
    <div class="handle_top">
        <a href="javascript:;" onclick='$(".handle_bot").toggle();$(".handle_con_wrap").toggle()' class="btn left" title="{$lang.widget_list}"></a>
        <a href="javascript:;" id="widget_save_button" class="btn right" title="{$lang.save}"></a>
        <div style="clear:both;height:0; display:block; overflow:hidden"></div>
    </div>

    <div class="handle_bot" style="display: none">
        <div class="handle_con">
            <div class="handle_con_box">
                <div class="widget_list">
                    <ul id="widget_list_ul"></ul>
                    <div class="clear"></div>
                </div>
            </div>
        </div>
    </div>
    
</div>
<div class="handle_wrap"></div>
<div class="handle_con_wrap" style="display: none"></div>
<form id="_edit_page_form_" style="display:none"></form>